<template>
	<el-main class="bg">
		<el-form ref="form" :model="form" status-icon label-width="120px" v-if="is_view()">
			<el-col
				v-if="user_group === '管理员' || $check_field('get', 'event_name') || $check_field('add', 'event_name') || $check_field('set', 'event_name')"
				:xs="24" :sm="12" :lg="8">
				<el-form-item label="赛事名称" prop="event_name">
					<el-select id="event_name" v-model="form['event_name']" placeholder="请选择赛事名称"
						v-if="user_group === '管理员' || (form['team_score_id'] && $check_field('set', 'event_name')) || (!form['team_score_id'] && $check_field('add', 'event_name'))"
						:disabled="disabledObj['event_name_isDisabled']" @change="filterTeamsByEventName">
						<el-option v-for="event in eventNameList" :key="event" :label="event" :value="event"></el-option>
					</el-select>
					<div v-else-if="$check_field('get', 'event_name')">{{ form['event_name'] }}</div>
				</el-form-item>
			</el-col>
			<el-col
				v-if="user_group === '管理员' || $check_field('get', 'college_name') || $check_field('add', 'college_name') || $check_field('set', 'college_name')"
				:xs="24" :sm="12" :lg="8">
				<el-form-item label="院系" prop="college_name">
					<el-select id="college_name" v-model="form['college_name']" placeholder="请选择院系"
						v-if="user_group === '管理员' || (form['team_score_id'] && $check_field('set', 'college_name')) || (!form['team_score_id'] && $check_field('add', 'college_name'))"
						:disabled="disabledObj['college_name_isDisabled']" @change="filterTeamsByCollege">
						<el-option v-for="college in college_list" :key="college" :label="college" :value="college"></el-option>
					</el-select>
					<div v-else-if="$check_field('get', 'college_name')">{{ form['college_name'] }}</div>
				</el-form-item>
			</el-col>
			<el-col
				v-if="user_group === '管理员' || $check_field('get', 'team_name') || $check_field('add', 'team_name') || $check_field('set', 'team_name')"
				:xs="24" :sm="12" :lg="8">
				<el-form-item label="团队名称" prop="team_name">
					<el-select id="team_name" v-model="form['team_name']" placeholder="请选择团队名称"
						v-if="user_group === '管理员' || (form['team_score_id'] && $check_field('set', 'team_name')) || (!form['team_score_id'] && $check_field('add', 'team_name'))"
						:disabled="disabledObj['team_name_isDisabled']" @change="filterTeamsByTeamName">
						<el-option v-for="team in teamNameList" :key="team" :label="team" :value="team"></el-option>
					</el-select>
					<div v-else-if="$check_field('get', 'team_name')">{{ form['team_name'] }}</div>
				</el-form-item>
			</el-col>
			<el-col
				v-if="user_group === '管理员' || $check_field('get', 'score') || $check_field('add', 'score') || $check_field('set', 'score')"
				:xs="24" :sm="12" :lg="8">
				<el-form-item label="得分" prop="score">
					<el-input id="score" v-model="form['score']" placeholder="请输入得分"
						v-if="user_group === '管理员' || (form['team_score_id'] && $check_field('set', 'score')) || (!form['team_score_id'] && $check_field('add', 'score'))"
						:disabled="disabledObj['score_isDisabled']"></el-input>
					<div v-else-if="$check_field('get', 'score')">{{ form['score'] }}</div>
				</el-form-item>
			</el-col>
			<el-col
				v-if="user_group === '管理员' || $check_field('get', 'judge_comment') || $check_field('add', 'judge_comment') || $check_field('set', 'judge_comment')"
				:xs="24" :sm="12" :lg="8">
				<el-form-item label="评委评语" prop="judge_comment">
					<el-input id="judge_comment" v-model="form['judge_comment']" placeholder="请输入评委评语"
						v-if="user_group === '管理员' || (form['team_score_id'] && $check_field('set', 'judge_comment')) || (!form['team_score_id'] && $check_field('add', 'judge_comment'))"
						:disabled="disabledObj['judge_comment_isDisabled']"></el-input>
					<div v-else-if="$check_field('get', 'judge_comment')">{{ form['judge_comment'] }}</div>
				</el-form-item>
			</el-col>


			<el-col :xs="24" :sm="12" :lg="8">
				<el-form-item>
					<el-button type="primary" @click="submit()">提交</el-button>
					<el-button @click="cancel()">取消</el-button>
				</el-form-item>
			</el-col>
		</el-form>
	</el-main>
</template>
<script>
import mixin from "@/mixins/page.js";

export default {
	mixins: [mixin],
	data() {
		return {
			// eventNameList: ['校园篮球联赛',
			// 	'校际足球锦标赛',
			// 	'全校田径运动会',
			// 	'校园羽毛球公开赛',
			// 	'校乒乓球友谊赛',
			// 	'校园游泳比赛',
			// 	'校园网球对抗赛',
			// 	'校际排球邀请赛'],
			eventNameList: [],
			college_list: ['计算机学院', '材料与食品学院', '经贸学院', '管理学院', '外国语学院', '电子信息学院', '机电工程学院', '艺术设计学院', '人文社会科学学院', '继续教育学院'],
			field: "team_score_id",
			url_add: "~/api/team_competition_score/add?",
			url_set: "~/api/team_competition_score/set?",
			url_get_obj: "~/api/team_competition_score/get_obj?",
			query: {
				"team_score_id": 0,
			},
			form: {
				"college_name": '',
				"event_name": '', // 赛事名称
				"score": null, // 得分
				"judge_comment": '', // 评委评语
				"team_name": '', // 团队名称
				"team_registration_id": 0, // 团队报名ID
				"team_score_id": 0, // ID
			},
			disabledObj: {
				"event_name_isDisabled": false,
				"score_isDisabled": false,
				"judge_comment_isDisabled": false,
				"team_name_isDisabled": false,
			},
			fitList: [],
			form_list: [],
			filteredTeams: [],
			teamNameList: [],
		}
	},
	created() {
		this.get_team_info();
	},
	methods: {
		//获取团队报名信息
		async get_team_info() {
			var json = await this.$get("~/api/team_registration/get_list?like=0");
			console.log(json.result.list);
			this.form_list = json.result.list;
			const uniqueEventNames = new Set();
			if (json.result && json.result.list) {
				json.result.list.forEach(item => {
					uniqueEventNames.add(item.event_name);
				});
				this.eventNameList = Array.from(uniqueEventNames);
			} else if (json.error) {
				console.error(json.error);
			}
			// 初始筛选
			this.filterTeamsByCollege(this.form['college_name']);
		},
		filterTeamsByEventName(eventName) {
			this.fitList = this.form_list.filter(item => item.event_name === eventName);
		},
		filterTeamsByCollege(collegeName) {
			if (collegeName) {

				this.filteredTeams = this.fitList.filter(item => item.college_name === collegeName);
				// 提取团队名称
				this.teamNameList = this.filteredTeams.map(item => item.team_name);
				console.log(this.teamNameList);

			} else {
				this.filteredTeams = [];
				this.teamNameList = [];
			}
		},
		filterTeamsByTeamName(teamName) {
			console.log(teamName, this.filteredTeams);

			if (teamName) {
				this.form['team_registration_id'] = this.filteredTeams.find(item => item.team_name === teamName).team_registration_id;
			}
		},
		is_view() {
			var bl = this.user_group == "管理员";
			if (!bl) {
				bl = this.$check_action('/team_competition_score/table', 'add');
			}
			if (!bl) {
				bl = this.$check_action('/team_competition_score/table', 'set');
			}
			if (!bl) {
				bl = this.$check_action('/team_competition_score/view', 'add');
			}
			if (!bl) {
				bl = this.$check_action('/team_competition_score/view', 'set');
			}
			if (!bl) {
				bl = this.$check_action('/team_competition_score/view', 'get');
			}
			return bl;
		},
	},
}
</script>
<style>
.bg {
	background: white;
}
</style>